<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>plupload</title>
    <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script>
    <script src="https://cdn.bootcss.com/jqueryui/1.12.1/jquery-ui.js"></script>
    <script type="text/javascript" src="plupload/js/plupload.full.min.js"></script>
    <script type="text/javascript" src="plupload/js/jquery.ui.plupload/jquery.ui.plupload.min.js"></script>
    <script type="text/javascript" src="plupload/js/i18n/zh_CN.js"></script>
    <link href="https://cdn.bootcss.com/jqueryui/1.12.1/jquery-ui.css" rel="stylesheet">
    <link  type="text/css" href="plupload/js/jquery.ui.plupload/css/jquery.ui.plupload.css" rel="external nofollow" rel="stylesheet">
</head>
<body>
<div id="uploader">
    <p>Your browser doesn't have Flash, Silverlight or HTML5 support.</p>
</div>
<script type="text/javascript">
    $(function() {
        $("#uploader").plupload({
            runtimes: 'html5,flash,silverlight,html4',//这里可以不写,plupload默认支持

            url: "http://test.upload.com/slice_upload.php",//上传后台请求路径

            max_file_size: '1000mb',//用来限制单个文件大小的

            multi_selection: true,//默认支持多文件上传,false不支持

            chunk_size: '200kb',//是否将上传文件进行分片,0代表是不分

            /*resize配置是对图片的处理

              可以使用该参数对将要上传的图片进行压缩，该参数是一个对象，里面包括5个属性：width：指定压缩后图片的宽度，如果没有设置该属性则默认为原始图片的宽度

              height：指定压缩后图片的高度，如果没有设置该属性则默认为原始图片的高度

              crop：是否裁剪图片

              quality：压缩后图片的质量，只对jpg格式的图片有效，默认为90。quality可以跟width和height一起使用，但也可以单独使用，单独使用时，压缩后图片的宽高不会变化，但由于质量降低了，所以体积也会变小

              preserve_headers：压缩后是否保留图片的元数据，true为保留，false为不保留,默认为true。删除图片的元数据能使图片的体积减小一点点

              resize参数的配置示例如下：

            */

            /* resize : {

              width: 200,

              height: 200,

              quality: 90,

              crop: true

            }, */

            /* rename: true, *///允许多队列文件进行重命名

            /* sortable: true,*/ //启用队列中的文件排序功能，更改上传优先级

            /*dragdrop: true, */ //开启拖拽上传,默认true

            /*

              下面是展示右边的缩略图和列表 两个功能

              默认显示缩略图

            */

            views: {

                list: true,

                thumbs: true, // Show thumbs

                active: 'thumbs'

            },

            /*

              flash 和 xap 上传需要的文件

            */

            flash_swf_url : 'plupload/js/Moxie.swf',

            silverlight_xap_url : 'plupload/js/Moxie.xap'
        });
    });
</script>
</body>
</html>